3D model

View your 3D models in the browser. For performance reasons we use the AR quality models for showcase as these are optimized for web use.

The 3D model-viewer is based on the Google model-viewer. You can access the entire API of the model-viewer by using the modelViewer property of the cylindo-viewer element.

Result

Live Editor

function Component() {
  useLayoutEffect(() => {
    const viewer = document.querySelector("cylindo-viewer");
    viewer.addEventListener("loaded", () => {
      const { modelViewer } = viewer;
      modelViewer.exposure = 0.9;
    });
  }, []);
  return (
    <cylindo-viewer customer-id="5098" code="ARMCHAIR-PDP">
      <cylindo-model />
    </cylindo-viewer>
  );
}